<template>
  <div class="app-container">
    <el-card shadow="always">
      <h1 style="text-align: center"  >{{reportDetail.reportTitle}}</h1>
      <div>
        <div v-if="reportDetail.contentType===0">
          <div v-html="reportDetail.content" ></div>
        </div>
        <div v-if="reportDetail.contentType===1">
          下载文档
          <a :href="reportDetail.fileUrl" :download="templateName" ><el-button icon="el-icon-document" circle></el-button></a>
        </div>
      </div>
       <el-divider></el-divider>
       审核意见：
       <div>
             <el-select v-model="score.reportStatus" placeholder="请选择">
                <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
            </el-select>
            <div v-if="score.reportStatus === '1'" >
              评语：
              <el-input
              type="textarea"
              :autosize="{ minRows: 2, maxRows: 4}"
              placeholder="请输入内容"
              v-model="score.reason">
              </el-input>
            </div>
            <div v-if="score.reportStatus === '2'" >
                驳回原因：
              <el-input
              type="textarea"
              :autosize="{ minRows: 2, maxRows: 4}"
              placeholder="请输入内容"
              v-model="score.reject">
              </el-input>

            </div>
            <div v-if="score.reportStatus === '1'">
                分数：
                <el-input v-model="score.resultValue" type="number"  placeholder="请输入分数"></el-input>
            </div>
            <el-button v-if="score.reportStatus === '1' || score.reportStatus === '2' " type="primary"  @click="reportResult()">提交</el-button>
       </div>
    </el-card>
  </div>
</template>
<script>
import { getReport,rejectReport } from '@/api/report'
import { reportResult } from '@/api/result'
export default {
  data() {
    return {
      reportDetail:{},
      param:{
        reportId:''
      },
       options: [{
          value: '1',
          label: '审核通过'
        }, {
          value: '2',
          label: '驳回'
        }],
        score:{
            reportId:'',
            reject:'',
            studentAccount:'',
            reportStatus:'',
            reportType:null, 
            reason:'',
            resultValue:''
        },
    }
  },
  //页面打开时执行的方法
  created() {
    this.score.reportId = this.$route.query.reportId;
    this.param.reportId = this.$route.query.reportId;
    this.score.studentAccount = this.$route.query.studentAccount;
    this.getReport();
  },
   methods: {
     async getReport(){
          let res = await getReport(this.param);
          this.reportDetail =res.bean;
      },
      reportResult() {
        if(this.score.reportStatus === '1'){
          this.score.reportType = this.reportDetail.reportType
        reportResult(this.score).then(()=>{
            this.$message({
              type: 'success',
              message: '提交审核结果成功!'
            })
            this.$router.go(-1)
            }
          ).catch(err=>{
            this.$message({
              type: 'success',
              message: '提交审核结果失败!'
            })
            })
      }else if(this.score.reportStatus === '2'){
         rejectReport(this.score).then(()=>{
            this.$message({
              type: 'success',
              message: '报告驳回成功!'
            })
            this.$router.go(-1)
            }
          ).catch(err=>{
            this.$message({
              type: 'success',
              message: '报告驳回失败!'
            })
            })
      }
      }
   }
}
</script>
